{% extends "model.html" %}
{% block content %}
<input class="btn btn-default" type="button" id="btnAdd" value="新建表单">
<script type="text/javascript">
    $(function () {
        bindBtnAddEvent();
        bindBtnSaveEvent();
    })

    function bindBtnAddEvent() {
        $("#btnAdd").click(function () {
            //点击新建按钮显示对话框
            $('#myModal').modal('show');
        })
    }

    function bindBtnSaveEvent() {
        $('#error-msg').empty(),
        $("#save").click(function (){
            $.ajax({
                url:"/ajax/order/",
                type:"post",
                data:$("#formadd").serialize(),
                dataType:"json",
                success:function (res){
                    if(res.status){
                        alert("添加陈工")
                    }else{
                        $.each(res.errors,function(name,data     ){
                            $("#id_"+name).next().text(data[0]);
                        })
                    }
                }
            })
        })
    }
</script>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body">
            <form id="formadd">
                <div class="clearfix">
                    {% for obj in form %}
                        <div class="form-group">
                            <div class="col-xs-6">
                                <label>{{ obj.label }}</label>
                                {{ obj }}
                                <span class="error-msg" style="color: red"></span>
                            </div>
                        </div>
                    {% endfor %}
                </div></form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" id="save">Save changes</button>
            </div>
        </div>
    </div>
</div>

{% endblock %}